<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<title>jQuery Mix Photo Gallery</title>
		<link type="text/css" rel="stylesheet" href="gallery/gallery.css" />
		<script type="text/javascript" src="gallery/js/jquery-1.3.2.min.js"></script>
		<script type="text/javascript" src="gallery/js/jquery.easing.1.3.js"></script>
		<script type="text/javascript" src="gallery/js/jquery.galleryview-1.1.js"></script>
		<script type="text/javascript" src="gallery/js/jquery.timers-1.2.js"></script>
		<script  type="text/javascript" src="gallery/js/album.js"></script>
		<script type="text/javascript">
			$(albumSETUP);
		</script>
	</head>
	<body>
		<h1>jQuery Mix Photo Gallery</h1>
		<div id="container">
		  	<div id="left">
		    	<div id="left-album"> </div>
		 	 </div>
		  	<div id="right">
		    	<div id="buttons">
		      		<button id="reset-album">reset</button>
		    	</div>
		    	<div id="right-album"> 
		    		<a class="album" href="#album-1"> 
		    			<img src="gallery/album-1.jpg" />
		      			<div>
		        			<h3>Album One</h3>
		        			<p>Hello<br/>world </p>
		      			</div>
		      		</a> 
<!-- 		      		<a class="album" href="#album-1"> 
		      				<img src="gallery/album-1.jpg" />
					    <div>
					        <h3>Album One</h3>
					        <p>Hello<br/>world </p>
					      </div>
		      </a> <a class="album" href="#album-1"> <img src="gallery/album-1.jpg" />
		      <div>
		        <h3>Album One</h3>
		        <p>Hello<br />
		          world </p>
		      </div>
		      </a> -->
		      <!---->
		      		<a class="album" href="#album-2"> 
		      			<img src="gallery/album-2.jpg" />
		     			<div>
		       				 <h3>Album Two</h3>
		        			<p>Hello<br/>world </p>
		      			</div>
		      		</a> 
<!-- 		      		<a class="album" href="#album-2"> 
							<img src="gallery/album-2.jpg" />
		      <div>
		        <h3>Album Two</h3>
		        <p>Hello<br />
		          world </p>
		      </div>
		      </a> <a class="album" href="#album-2"> <img src="gallery/album-2.jpg" />
		      <div>
		        <h3>Album Two</h3>
		        <p>Hello<br />
		          world </p>
		      </div>
		      </a> -->
		      <!---->
		      		<a class="album" href="#album-3"> 
		      			<img src="gallery/album-3.jpg" />
		      			<div>
		        			<h3>Album Three</h3>
		        			<p>Hello<br/>world </p>
		      			</div>
		      		</a>
<!-- 		      		<a class="album" href="#album-3"> 
		      			<img src="gallery/album-3.jpg" />
		      <div>
		        <h3>Album Three</h3>
		        <p>Hello<br />
		          world </p>
		      </div>
		      </a><a class="album" href="#album-3"> <img src="gallery/album-3.jpg" />
		      <div>
		        <h3>Album Three</h3>
		        <p>Hello<br />
		          world </p>
		      </div>
		      </a> --> 
			</div>
		    
			<br clear="all" />
		    
		    <div id="right-album-gallery">
		      <!--album-1-->
		      <div id="album-1" class="galleryview">
		        <div class="panel"> <img src="gallery/04.jpg" />
		          <div class="panel-overlay">
		            <h2> Album-1 :: Flowers</h2>
		            <p>Photo by <a href="#" target="_blank">jazza</a>. View full-size
		              photo <a href="#" target="_blank">here</a>.</p>
		          </div>
		        </div>
		        <div class="panel"> <img src="gallery/05.jpg" />
		          <div class="panel-overlay">
		            <h2> Album-1 :: Sunrise Trees</h2>
		            <p>Photo by <a href="#" target="_blank">a_glitch</a>. View full-size
		              photo <a href="#" target="_blank">here</a>.</p>
		          </div>
		        </div>
		        <div class="panel"> <img src="gallery/06.jpg" />
		          <div class="panel-overlay">
		            <h2> Album-1 :: Alone Beach 2B</h2>
		            <p>Photo by <a href="#" target="_blank">sgursozlu</a>. View full-size
		              photo <a href="#" target="_blank">here</a>.</p>
		          </div>
		        </div>
		        <ul class="filmstrip">
		          <li><img src="gallery/frame-04.jpg" alt="Flowers" title="Flowers" /></li>
		          <li><img src="gallery/frame-05.jpg" alt="Sunrise Trees" title="Sunrise Trees" /></li>
		          <li><img src="gallery/frame-06.jpg" alt="Alone Beach" title="Alone Beach" /></li>
		        </ul>
		      </div>
		      <!--album-2-->
		      <div id="album-2" class="galleryview">
		        <div class="panel"> <img src="gallery/01.jpg" />
		          <div class="panel-overlay">
		            <h2> Album-2 :: 1 Effet du soleil sur le paysage</h2>
		            <p>Photo by <a href="#" target="_blank">tomharry</a>. View full-size
		              photo <a href="#" target="_blank">here</a>.</p>
		          </div>
		        </div>
		        <div class="panel"> <img src="gallery/02.jpg" />
		          <div class="panel-overlay">
		            <h2> Album-2 :: Eden</h2>
		            <p>Photo by <a href="#" target="_blank">emsago</a>. View full-size
		              photo <a href="#" target="_blank">here</a>.</p>
		          </div>
		        </div>
		        <div class="panel"> <img src="gallery/03.jpg" />
		          <div class="panel-overlay">
		            <h2> Album-2 :: Snail on the Corn</h2>
		            <p>Photo by <a href="#" target="_blank">baines</a>. View full-size
		              photo <a href="#" target="_blank">here</a>.</p>
		          </div>
		        </div>
		        <ul class="filmstrip">
		          <li><img src="gallery/frame-01.jpg" alt="Effet du soleil" title="Effet du soleil" /></li>
		          <li><img src="gallery/frame-02.jpg" alt="Eden" title="Eden" /></li>
		          <li><img src="gallery/frame-03.jpg" alt="Snail on the Corn" title="Snail on the Corn" /></li>
		        </ul>
		      </div>
		      <!--album-3-->
		      <div id="album-3" class="galleryview">
		        <div class="panel"> <img src="gallery/07.jpg" />
		          <div class="panel-overlay">
		            <h2> Album-3 :: Waterfall</h2>
		            <p>Photo by <a href="#" target="_blank">thesaint</a>. View full-size
		              photo <a href="#" target="_blank">here</a>.</p>
		          </div>
		        </div>
		        <div class="panel"> <img src="gallery/08.jpg" />
		          <div class="panel-overlay">
		            <h2> Album-3 :: Death Valley</h2>
		            <p>Photo by <a href="#" target="_blank">djkmart</a>. View full-size
		              photo <a href="#" target="_blank">here</a>.</p>
		          </div>
		        </div>
		        <ul class="filmstrip">
		          <li><img src="gallery/frame-07.jpg" alt="Waterfall" title="Waterfall" /></li>
		          <li><img src="gallery/frame-08.jpg" alt="Death Valley" title="Death Valley" /></li>
		        </ul>
		      </div>
		    </div>
		  </div>
		</div>
		</div>
	</body>
</html>